@import "../../common/css/variables.scss";
@import "../../../common/css/size.scss";
.m-order{
  height: 100%;
  width: 100%;
  background: $cbMainf5 ;
  overflow-y: auto;
  .content{
    position: absolute;
    width: 100%;
    height: calc(100% - #{$_48});
    overflow: auto;
  }
  //ios中设置只读但是光标会停靠
  [readonly="readonly"] {
  pointer-events: none;
}
.top{
  height: $_54;
  margin: $_14 $_7;
  padding: $_10 0 $_10 $_15;
  background: #fff url('../img/common/select-right.png') no-repeat  98% center;  
  background-size: $_8 $_16;
  box-shadow: 0 $_2 $_4 0 rgba(205,210,212,0.50);
  border-radius: $_4;
}
.top.nobg{
  background:#fff;
}
.productLi{
  background: #FFF;
  .proItemN4{
    margin: 0 $_10;
    width: calc(100% - #{$_20});
    border-bottom: $_1 solid #e7e7e7;
    box-shadow: none;
    border-radius: 0;
    .btm{
      display: none;
    }
  }
}
.coupon{
  height: $_50;
  background: #fff url('../img/common/select-right.png') no-repeat  98% center;
  background-size: $_8 $_16;
  padding:0 $_38 0 $_15;
  width: calc(100% - $_53);
  box-shadow: 0 $_2 $_4 0 rgba(205,210,212,0.50);
span{
  color: #798084;
  font-size: $_16;
  letter-spacing: $_1;
}
}

.address{
  .addressDt{
    color: #798084;
    margin-left: $_10;
    line-height: $_50;
  }
  @keyframes switchAniL {
    0%{transform: translateX($_25)}
    100%{transform: translateX($_1)}
  }
  @keyframes switchAniR {
    0%{transform: translateX($_1)}
    100%{transform: translateX($_25)}
  }
  .addressDd{
    background: #FFFFFF;
    box-shadow: 0 $_2 $_2 0 rgba(205,208,212,0.50);
    dd *{
      color: #6A6B6B;
      letter-spacing: $_1;
    }
    dd{
      margin: 0 $_10;
      width: calc(100% - #{$_20});
    }
    dd input{
      border: none;
    }
    dd:first-child{
      line-height: $_40;
    }
    dd:nth-child(2){
      line-height: $_55;
      border-top: $_1 solid #e7e7e7;
      border-bottom: $_1 solid #e7e7e7;
    }
    dd:last-child{
      padding: $_10,0;
      line-height: $_25;
      textarea{
        width: 100%;
        border: 0;
      }
    }
    .switchBtn .switch{
      background: #CACED1;
      transition: background 0.5s;
      height: $_26;
      width: $_50;
      .sbtn{
        width: $_24;
        height: $_24;
        border-radius: 50%;
        background: #fff;
        display: inline-block;
        animation: switchAniL 0.5s forwards;
      }
    }
    .switchBtn .switch.active{
      background: $cMain;
      transition: background 0.5s ;
      .sbtn{
        animation: switchAniR 0.5s forwards;
      }
    }
  }
}

.disclaimer{
  margin-left: $_10;
  // padding-left: $_26;
  margin-bottom: $_30;
  // line-height: $_50;
  letter-spacing: $_1;
  font-size: $_12;
  color: #626368;
  .agree{
      width: $_22;
      margin-right: $_4;
      margin-bottom: $_1
    }
}
.bottom{
  height: $_48;
  width: 100%;
  position: absolute;
  bottom: 0;
  .total{
    width: calc(100% - #{$_248});
    text-align: center;
    line-height: $_48;
    // letter-spacing: $_2;
    background: #fff;
  }
  .total.width2{
    width: calc(100% - #{$_124})
  }
  .forward,.pay{
    border:none;
    line-height: $_48;
    text-align: center;
    letter-spacing: $_2;
    font-size: $_16;
    width: $_124;
    color: #fff;
  }
  .forward:disabled,.pay:disabled{
    background: $cbtndisable;
  }
  .forward{
    background: #4ED1E1;
  }
  .pay{
    background: $cMain;
  }
}

}

.reservation,.m-orderAll .clientSelect { 
  position: absolute;
  height: 100%;
  width: 100%;
  overflow: auto;
  .top{
    .relationship{
      display: none;
    }
    .salary{
      display: none;
    }
    .checkit{
      display: block !important;
      width: $_18;
      background-position: center;
    }
    .checkit.active{
      background-position: center;
    }
  }
}

.suc-info{
  background:#fff url("../img/common/suc-info.png") no-repeat 50% 25%;
  background-size: $_60 $_60;
}
.fail-info{
  background: url("../img/common/fail-info.png") no-repeat 50% 25%;
  background-size: $_60 $_60;
}
.m-disclaimer{
  padding: $_10;
  position: absolute;
  width: calc(100% - #{$_20});
  height: calc(100% - #{$_20});
  overflow: auto;
  background: #fff;
  .title{
    text-align: center;
    font-size: $_16;
    // margin-top: $_10;
  }
  h4{
    color: #5D6061;
    font-size: $_18;
    margin:$_10 0;
  }
  p{
    color: #798084;
    line-height: $_22;
    text-indent: $_20;
    font-size: $_16;
    // margin-bottom: $_10;
  }
}